<body>
    <div class="easyui-tabs" id="customerAnalysis-tabs">
		
    	<div title="客户地区分布" style="padding:10px">
    		<div id="provinceChart" style="width:600px; height: 300px; margin: 0 auto"></div>
        </div>
        <div title="客户城市分布" style="padding:10px">
        	<div id="cityChart" style="width:600px; height: 300px; margin: 0 auto"></div>
        </div>
        <div title="客户年龄分布" style="padding:10px">
        	<div id="ageChart" style="width:600px; height: 300px; margin: 0 auto"></div>
        </div>
        <div title="手术项目比例" style="padding:10px">
        	<div id="itemsChart" style="width:600px; height: 300px; margin: 0 auto"></div>
        </div>
        <div title="客户职业分布" style="padding:10px">
        	<div id="workChart" style="width:600px; height: 300px; margin: 0 auto"></div>
        </div>
    </div>
	
	<script type="text/javascript">
	$(function () {
		
		var analysisData = reportJs.getData()
		
		var searchFilter = analysisData.title;
		analysisData  = jQuery.parseJSON(analysisData.content);
		
		var province = $('#provinceChart');
		fillChart(province,'客户地区分布 '+searchFilter,analysisData.provinces);
		fillChart($('#cityChart'),'客户城市分布 '+searchFilter,analysisData.cities);
		fillChart($('#ageChart'),'客户年龄分布 '+searchFilter,analysisData.ages);
		fillChart($('#itemsChart'),'手术项目分布 '+searchFilter,analysisData.items);
		fillChart($('#workChart'),'客户职业分布 '+searchFilter,analysisData.works);
	});
	   
	function fillChart(component,title,data){
	    $(component).highcharts({
	        chart: {
	            plotBackgroundColor: null,
	            plotBorderWidth: null,
	            plotShadow: false
	        },
	        title: {
	            text: title
	        },
	        tooltip: {
	    	    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
	        },
	        plotOptions: {
	            pie: {
	                allowPointSelect: true,
	                cursor: 'pointer',
	                dataLabels: {
	                    enabled: true,
	                    color: '#000000',
	                    connectorColor: '#000000',
	                    format: '<b>{point.name}</b>: {point.percentage:.1f} %'
	                }
	            }
	        },
	        series: [{
	            type: 'pie',
	            name: title,
	            data: data
	        }]
	    });
	}
	</script>
	    <style type="text/css">
        .view_customer11{
        	margin-bottom:5px;
        	margin-left:9px;
        	display:inline-block;
            width:190px;
        }
        
    </style>
</body>